<template>
  <div class="home">
    <my-header>请答题</my-header>
    <div class="content">
      <my-card v-show="num === i" v-model:num="num" v-for="(item, i) in list" :index="i" :key="item.id" :item="item"></my-card>
    </div>
  </div>
</template>

<script>
import myHeader from '@/components/myHeader/myHeader'
import myCard from '@/components/myCard/myCard'
import axios from 'axios'
import { reactive, toRefs } from 'vue'
localStorage.setItem('rightNum', 0)
export default {
  name: 'Home',
  components: {
    myHeader,
    myCard
  },
  setup() {
    // console.log(list);
    const titles = reactive({
      list: [],
      num: 0
    })
    axios.get('/data.json').then(res => {
      // console.log(res);
      titles.list = res.data
    })
    localStorage.setItem('num', titles.num)

    return {
      ...toRefs(titles)
    }
  }
}
</script>
<style lang="scss" scoped>
  .content {
  padding: 0 15px;}
</style>

